<!-- 数据管理 =》 指标体系 =》 指标体系预览 -->
<script setup lang="ts">
// import { ElRow, ElCol } from 'element-plus'
import { ContentWrap } from '@/components/ContentWrap'
import { Search } from '@/components/Search'
import { FormSchema } from '@/components/Form'
import { reactive, ref } from 'vue'
import useCommonApi from '@/hooks/web/useCommonApi'
const { useIndicatorSystem, useOneLevel } = useCommonApi()

const schema = ref<FormSchema[]>([
  {
    field: 'categoryId',
    label: '指标体系',
    component: 'Select',
    optionApi: () => {
      return useIndicatorSystem()
    },
    formItemProps: {
      style: {
        width: '300px'
      }
    },
    componentProps: {
      placeholder: '请选择指标体系',
      on: {
        change: (value: string | number) => {
          console.log(value)
          if (value) {
            schema.value[1].componentProps.disabled = false
            schema.value[1].optionApi = () => {
              return useOneLevel(value)
            }
          } else {
            schema.value[1].componentProps.disabled = true
            schema.value[1].optionApi = () => {
              return []
            }
          }
        }
      }
    }
  },
  {
    field: 'levelOneScoreId',
    label: '一级指标',
    component: 'Select',
    // optionApi: () => {
    //   return useIndicatorSystem()
    // },
    formItemProps: {
      style: {
        width: '300px'
      }
    },
    componentProps: {
      disabled: true,
      placeholder: '请选择一级指标',
      on: {
        change: (value: string | number) => {
          console.log(value)
        }
      }
    }
  }
])

// console.log(unref(schema))
let searchParams = reactive({})

const setSearchParams = (params: any) => {
  // searchParams.value = params
  // getList()
  console.log(params)
  // this.searchParams = params
  Object.assign(searchParams, params)
}
</script>

<template>
  <content-wrap>
    <search :schema="schema" @search="setSearchParams" @reset="setSearchParams" />
  </content-wrap>
</template>
